<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>

<body>







	<button>获取验证码</button>
	<script>
		$(function() {
			let flag = true; //  值为true表示可以进入定时器  为false表示当前的还米有走完 不允许进入

			let timerId = null;
			$('button').on('click', function() {
				if (!flag) return

				flag = false //关门
				let n = 5;
				timerId = setInterval(() => {
					n--
					$(this).html(n + 's')
					if (n <= 0) {
						//  时间走完了===清除定时器==文本还原【获取验证码】
						clearInterval(timerId)
						$(this).html('获取验证码')
						flag = true //  表示自己走完了

					}
				}, 1000)
			})
		})
	</script>

</body>

</html>
